/*
	CSS code shared between the D3 Community Site and the Tooltip Script.

	Note: All global styles should be prefixed with d3- to avoid affecting 3rd party sites.
*/

/* item properties (shared between item detail page, item browsing, and item tooltips */
.d3-item-properties ul,
.d3-item-properties div { margin-top: 10px; }
.d3-item-properties ul ul { margin-top: 0; }
.d3-item-properties ul li { margin: 1px 0; }
.d3-item-properties ul li.bump { margin-top: 10px; }
.d3-item-properties p { margin: 0 !important; }
.d3-item-properties .indent { padding-left: 18px; }
.d3-item-properties .value { color: #ded2ab; }
.d3-item-properties .item-armor-weapon .big .value { font-size: 18px; clear: right; }
.d3-item-properties .item-requirement { color: #A99877 }
.d3-item-properties .d3-color-blue .value { color: #bda6db !important; }
.d3-item-properties .d3-color-gold .value { color: white !important; }
.d3-item-properties .item-type,
.d3-item-properties .item-type-right { margin-top: 0; }
.d3-item-properties .item-type-right { float: right; text-align: right; }
.d3-item-properties .item-before-effects { display: none; }
.d3-item-properties .item-effects li { padding-left: 16px; background: url("../images/icons/bullet.gif") 2px 6px no-repeat; }
.d3-item-properties .item-effects li.empty-socket { background: url("../images/item/empty-socket.png") 0 center no-repeat; }
.d3-item-properties .item-effects .gem-effect { color: white; }
.d3-item-properties .item-effects-choice { margin-bottom: 10px; }

.d3-tooltip-wrapper { background: #1d180e; padding: 1px; border: 1px solid #322a20; opacity: 0.95; max-width: 355px; position: absolute; z-index: 2147483647;
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;
	-moz-box-shadow: 0 0 10px #000; -webkit-box-shadow: 0 0 10px #000; box-shadow: 0 0 10px #000; }
.d3-tooltip-wrapper-inner { background: black; }

.d3-tooltip .title,
.d3-tooltip .subtitle { font-family: "Palatino Linotype", "Georgia", "Times", serif; color: #F3E6D0; font-weight: normal; margin-bottom: 6px; }
.d3-tooltip .title { font-size: 18px; }
.d3-tooltip .subtitle { font-size: 14px; text-transform: uppercase; }
.d3-tooltip .special { color: #AD835A; }
.d3-tooltip .subtle { color: #7B6D55; display: block; }
.d3-tooltip .subtle em { color: #AD835A; font-weight: bold; font-style: normal; }
.d3-tooltip .flavor { font-size: 16px; color: #AD835A; font-family: "Palatino Linotype", "Times", serif; font-style: italic; }
.d3-tooltip .tip { border-bottom: 0; }
.d3-tooltip p { margin: 10px 0 0 0; }
.d3-tooltip p:first-child { margin-top: 0; }
.d3-tooltip .loading { display: block; width: 32px; height: 32px; background: url("../images/loaders/default.gif") no-repeat center center; }
.d3-tooltip .wip { position: absolute; z-index: 2; left: 0; top: 33%; width: 350px; text-align: center; font-size: 28px; font-family: "Palatino Linotype", "Georgia", "Times", serif; text-transform: uppercase; color: #A99877; opacity: 0.25; filter: alpha(opacity=25); line-height: 100%; }

	/* style reset */
	.d3-tooltip { padding: 2px; font: normal 12px/1.5 Arial, sans-serif; color: #CFB991; }
	.d3-tooltip * { margin: 0; padding: 0; background: none; }
	.d3-tooltip ul { list-style-type: none; }

	/* head */
	.d3-tooltip .tooltip-head { height: 40px; width: 320px; padding: 0 15px; background: url("../images/ui/tooltip-title.jpg") no-repeat; }
	.d3-tooltip .tooltip-head h3 { color: #F3E6D0; font: 22px "Palatino Linotype", "Times", serif; height: 40px; line-height: 37px; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
	.d3-tooltip .tooltip-head h3.smaller { font-size: 18px; line-height: 40px; }
	.d3-tooltip .tooltip-head h3.smallest { font-size: 14px; line-height: 42px; }
	.d3-tooltip .tooltip-head-gray { background-position: 0 -40px; }
	.d3-tooltip .tooltip-head-blue { background-position: 0 -80px; }
	.d3-tooltip .tooltip-head-yellow { background-position: 0 -120px; }
	.d3-tooltip .tooltip-head-green,
	.d3-tooltip .tooltip-head-orange { background-position: 0 -160px; }
	.d3-tooltip .tooltip-head-purple { background-position: 0 -200px; }

	/* body */
	.d3-tooltip .tooltip-body { position: relative; padding: 10px; }
	.d3-tooltip .item-armor-weapon li { color: #909090; }
	.d3-tooltip .item-armor-weapon li .value { color: #fff; }
	.d3-tooltip .item-armor-weapon .big .value { font-size: 250%; line-height: 100%; display: block; }

	/* extension */
	.d3-tooltip .tooltip-extension { margin: 10px -2px 0 -2px; padding: 10px 12px; border-top: 2px solid #322A20; } /* more horizontal padding to make up for negative margin */
	.d3-tooltip .tooltip-extension.rune-extension { padding-left: 87px; min-height: 52px; position: relative; }
	.d3-tooltip .tooltip-extension.rune-extension .d3-icon-rune { position: absolute; top: 10px; left: 20px; }

	/* item tooltips */
	.d3-tooltip-item .d3-icon-item { float: left; margin-right: 10px; margin-bottom: 10px; }
	.d3-tooltip-item .value { color: white; }
	.d3-tooltip-item .item-type { color: white; }
	.d3-tooltip-item .item-slot { color: #909090; }
	.d3-tooltip-item .item-armor-weapon { color: white; margin-top: 5px; }
	.d3-tooltip-item .item-armor-weapon .dps { font-size: 26px; }
	.d3-tooltip-item .item-before-effects { display: block !important; clear: both; }
	.d3-tooltip-item .item-description { margin-top: 10px; }
	.d3-tooltip-item .item-itemset { font-size: 12px; }

	.d3-tooltip-item .effect-bg { background-position: 10px 10px; background-repeat: no-repeat; }
	.d3-tooltip-item .effect-bg-arcane { background-image: url("../images/item/effect-bgs/arcane.jpg"); }
	.d3-tooltip-item .effect-bg-cold { background-image: url("../images/item/effect-bgs/cold.jpg"); }
	.d3-tooltip-item .effect-bg-fire { background-image: url("../images/item/effect-bgs/fire.jpg"); }
	.d3-tooltip-item .effect-bg-holy { background-image: url("../images/item/effect-bgs/holy.jpg"); }
	.d3-tooltip-item .effect-bg-lightning { background-image: url("../images/item/effect-bgs/lightning.jpg"); }
	.d3-tooltip-item .effect-bg-poison { background-image: url("../images/item/effect-bgs/poison.jpg"); }
	.d3-tooltip-item .effect-bg .item-type,
	.d3-tooltip-item .effect-bg .item-armor-weapon { text-shadow: 0 0 5px black, 0 0 5px black, 0 0 5px black; } /* makes the text readable when a background is used */

	/* skill tooltips */
	.d3-tooltip-skill .tooltip-body { padding-left: 85px; }
	.d3-tooltip-skill .d3-icon-skill { position: absolute; left: 10px; top: 10px; }

	/* trait tooltips */
	.d3-tooltip-trait .tooltip-body { padding-left: 105px; min-height: 80px; }
	.d3-tooltip-trait .d3-icon-trait { position: absolute; left: 10px; top: 10px; }

	/* rune tooltips */
	.d3-tooltip-rune .tooltip-body { padding-left: 60px; }
	.d3-tooltip-rune .d3-icon-rune { position: absolute; left: 10px; top: 10px; }

	/* calculator tooltips */
	.d3-tooltip-calculator { padding: 10px; min-width: 200px; }
	.d3-tooltip-calculator .title { font-size: 22px; line-height: 1em; margin-bottom: 0; }
	.d3-tooltip-calculator .subtitle {  }
	.d3-tooltip-calculator .empty { color: #808080; }
	.d3-tooltip-calculator li { position: relative; }
	.d3-tooltip-calculator li.row2 { background-color: #101010; }
	.d3-tooltip-calculator .skill-icon { position: absolute; }
	.d3-tooltip-calculator .skill-rune { position: absolute; right: 5px; top: 0; }
	.d3-tooltip-calculator .actives { padding-top: 15px; }
	.d3-tooltip-calculator .actives li { line-height: 24px; padding-left: 26px; padding-right: 35px; }
	.d3-tooltip-calculator .actives .skill-icon { left: 0; top: 2px; }
	.d3-tooltip-calculator .passives { padding-top: 15px; }
	.d3-tooltip-calculator .passives li { line-height: 30px; padding-left: 29px; }
	.d3-tooltip-calculator .passives .skill-icon { left: 0; top: 3px; }

/* icons */
.d3-icon { display: inline-block; overflow: hidden; background: 50% 50% no-repeat; font-size: 1px; }

.d3-icon-item,
.d3-icon-skill { -moz-box-shadow: 0 0 5px #000; -webkit-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000; }

	/* items */
	.d3-icon-item { border: 1px solid black; background: no-repeat left top;
		-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
	.d3-icon-item .icon-item-inner { display: block; background: no-repeat center center; border: 1px solid black; font-size: 1px; line-height: normal; text-align: center; overflow: hidden; }
	a:hover .d3-icon-item,
	.hover .d3-icon-item,
	.icon-active .d3-icon-item { background-position: left -128px; } /* brighter */

	.d3-icon-item-large .icon-item-default { width: 64px; height: 128px; }
	.d3-icon-item-large .icon-item-square  { width: 64px; height: 64px; }
	.d3-icon-item-large .icon-item-big     { width: 82px; height: 164px; }

	.d3-icon-item-small .icon-item-default { width: 32px; height: 64px; }
	.d3-icon-item-small .icon-item-square  { width: 32px; height: 32px; }
	.d3-icon-item-small .icon-item-big     { width: 41px; height: 82px; }

	.d3-icon-item-32 .icon-item-default,
	.d3-icon-item-32 .icon-item-square,
	.d3-icon-item-32 .icon-item-big { width: 32px; height: 32px; }

	.d3-icon-item-64 .icon-item-default,
	.d3-icon-item-64 .icon-item-square,
	.d3-icon-item-64 .icon-item-big { width: 64px; height: 64px; }

		/* white */
		.d3-icon-item-white { border-color: #2d1c0f; border-right-color: #382213; border-bottom-color: #402715; background-image: url("../images/item/icon-bgs/white.png"); }
		a:hover .d3-icon-item-white,
		.hover .d3-icon-item-white,
		.icon-active .d3-icon-item-white { border-color: #4b2e19; }

		a:hover .d3-icon-item-white,
		.hover .d3-icon-item-white,
		.icon-active .d3-icon-item-white { background-position: -200px 0; }

		/* blue */
		.d3-icon-item-blue { border-color: #25536b; border-right-color: #2e6786; border-bottom-color: #357598; background-image: url("../images/item/icon-bgs/blue.png"); }
		a:hover .d3-icon-item-blue,
		.hover .d3-icon-item-blue,
		.icon-active .d3-icon-item-blue { border-color: #3e8ab3; }

		/* yellow */
		.d3-icon-item-yellow { border-color: #6b650f; border-right-color: #867e13; border-bottom-color: #988f15; background-image: url("../images/item/icon-bgs/yellow.png"); }
		a:hover .d3-icon-item-yellow,
		.hover .d3-icon-item-yellow,
		.icon-active .d3-icon-item-yellow { border-color: #b3a819; }

		/* orange */
		.d3-icon-item-orange { border-color: #733c1c; border-right-color: #8f4b23; border-bottom-color: #a35528; background-image: url("../images/item/icon-bgs/orange.png"); } }
		a:hover .d3-icon-item-orange,
		.hover .d3-icon-item-orange,
		.icon-active .d3-icon-item-orange { border-color: #BF642F; }

		/* green */
		.d3-icon-item-green { border-color: #297d14; border-right-color: #349c19; border-bottom-color: #3bb11c; background-image: url("../images/item/icon-bgs/green.png"); }
		a:hover .d3-icon-item-green,
		.hover .d3-icon-item-green,
		.icon-active .d3-icon-item-green { border-color: #00d900; }

		/* purple */
		.d3-icon-item-purple { border-color: #5b2882; border-right-color: #7232a3; border-bottom-color: #8139b9; background-image: url("../images/item/icon-bgs/purple.png"); }
		a:hover .d3-icon-item-purple,
		.hover .d3-icon-item-purple,
		.icon-active .d3-icon-item-purple { border-color: #9843d9; }

	/* skills */
	.d3-icon-skill { }
	.d3-icon-skill .frame { display: block; background: no-repeat; }
	.d3-icon-skill-21,
	.d3-icon-skill-21 .frame { width: 21px; height: 21px; }
	.d3-icon-skill-42,
	.d3-icon-skill-42 .frame { width: 42px; height: 42px; }
	.d3-icon-skill-64,
	.d3-icon-skill-64 .frame { width: 64px; height: 64px; }
	.d3-icon-skill-21 .frame { background-image: url("../images/icons/frames/skill-21.png"); }
	.d3-icon-skill-42 .frame { background-image: url("../images/icons/frames/skill-42.png"); }
	.d3-icon-skill-64 .frame { background-image: url("../images/icons/frames/skill-64.png"); }
	.d3-icon-skill.selected .frame { background-position: top right; }

	a:hover .d3-icon-skill .frame,
	.hover .d3-icon-skill .frame { background-position: left bottom; }
	a:hover .d3-icon-skill.selected .frame,
	.hover .d3-icon-skill.selected .frame { background-position: right bottom; }

	a.disabled:hover .d3-icon-skill .frame,
	.disabled.hover .d3-icon-skill .frame { background-position: left top !important; }
	a.disabled:hover .d3-icon-skill.selected .frame,
	.disabled.hover .d3-icon-skill.selected .frame { background-position: right top !important; }

	/* traits */
	.d3-icon-trait { }
	.d3-icon-trait .frame { display: block; background: no-repeat; }
	.d3-icon-trait-21,
	.d3-icon-trait-21 .frame { width: 25px !important; height: 25px !important; }
	.d3-icon-trait-42,
	.d3-icon-trait-42 .frame { width: 51px !important; height: 51px !important; }
	.d3-icon-trait-64,
	.d3-icon-trait-64 .frame { width: 81px !important; height: 81px !important; }
	.d3-icon-trait-21 .frame { background-image: url("../images/icons/frames/trait-21.png"); }
	.d3-icon-trait-42 .frame { background-image: url("../images/icons/frames/trait-42.png"); }
	.d3-icon-trait-64 .frame { background-image: url("../images/icons/frames/trait-64.png"); }
	.d3-icon-trait.selected .frame { background-position: top right; }

	a:hover .d3-icon-trait .frame,
	.hover .d3-icon-trait .frame { background-position: left bottom; }
	a:hover .d3-icon-trait.selected .frame,
	.hover .d3-icon-trait.selected .frame { background-position: right bottom; }

	a.disabled:hover .d3-icon-trait .frame,
	.disabled.hover .d3-icon-trait .frame { background-position: left top !important; }
	a.disabled:hover .d3-icon-trait.selected .frame,
	.disabled.hover .d3-icon-trait.selected .frame { background-position: right top !important; }

	.d3-icon-trait.circle,
	.d3-icon-trait.circle .frame { width: 64px !important; height: 64px !important; }
	.d3-icon-trait.circle .frame { background-image: url("../images/icons/frames/trait-circle.png"); }

	/* runes */
	.d3-icon-rune { vertical-align: middle; }
	.d3-icon-rune span { display: block; vertical-align: top; background: no-repeat; }

	.d3-icon-rune-large span { width: 50px; height: 50px; background-image: url("../images/icons/runes/large.png"); }
	.d3-icon-rune-large .rune-a { background-position: 0 0; }
	.d3-icon-rune-large .rune-b { background-position: -50px 0; }
	.d3-icon-rune-large .rune-c { background-position: -100px 0; }
	.d3-icon-rune-large .rune-d { background-position: -150px 0; }
	.d3-icon-rune-large .rune-e { background-position: -200px 0; }
	.d3-icon-rune-large .rune-none { background-position: -250px 0; }

	.d3-icon-rune-medium span { width: 42px; height: 42px; background-image: url("../images/icons/runes/medium.png"); }
	.d3-icon-rune-medium .rune-a { background-position: 0 0; }
	.d3-icon-rune-medium .rune-b { background-position: -42px 0; }
	.d3-icon-rune-medium .rune-c { background-position: -84px 0; }
	.d3-icon-rune-medium .rune-d { background-position: -126px 0; }
	.d3-icon-rune-medium .rune-e { background-position: -168px 0; }
	.d3-icon-rune-medium .rune-none { background-position: -210px 0; }

	.d3-icon-rune-small span { width: 16px; height: 16px; background-image: url("../images/icons/runes/small.png"); }
	.d3-icon-rune-small .rune-a { background-position: 0 0; }
	.d3-icon-rune-small .rune-b { background-position: -16px 0; }
	.d3-icon-rune-small .rune-c { background-position: -32px 0; }
	.d3-icon-rune-small .rune-d { background-position: -48px 0; }
	.d3-icon-rune-small .rune-e { background-position: -64px 0; }
	.d3-icon-rune-small .rune-none { background-position: -80px 0; }

/* colors */

	/* general */
	.d3-color-blue, .d3-color-blue a { color: #6969ff !important; }
	.d3-color-gray, .d3-color-gray a { color: #909090 !important; }
	.d3-color-gold, .d3-color-gold a { color: #c7b377 !important; }
	.d3-color-green, .d3-color-green a { color: #00ff00 !important; }
	.d3-color-orange, .d3-color-orange a { color: #bf642f !important; }
	.d3-color-purple, .d3-color-purple a { color: #a335ee !important; }
	.d3-color-red, .d3-color-red a { color: #ff0000 !important; }
	.d3-color-white, .d3-color-white a { color: #fff !important; }
	.d3-color-yellow, .d3-color-yellow a { color: #ffff00 !important; }

	a.d3-color-blue:hover, .d3-color-blue a:hover, a:hover .d3-color-blue,
	a.d3-color-gray:hover, .d3-color-gray a:hover, a:hover .d3-color-gray,
	a.d3-color-gold:hover, .d3-color-gold a:hover, a:hover .d3-color-gold,
	a.d3-color-green:hover, .d3-color-green a:hover, a:hover .d3-color-green,
	a.d3-color-orange:hover, .d3-color-orange a:hover, a:hover .d3-color-orange,
	a.d3-color-purple:hover, .d3-color-purple a:hover, a:hover .d3-color-purple,
	a.d3-color-red:hover, .d3-color-red a:hover, a:hover .d3-color-red,
	a.d3-color-white:hover, .d3-color-white a:hover, a:hover .d3-color-white,
	a.d3-color-yellow:hover, .d3-color-yellow a:hover a:hover .d3-color-yellow { color: #fff !important; }

	/* runes */
	.d3-color-rune { color: #F3E6D0 !important; }
	.d3-color-rune-a { color: #e52817 !important; }
	.d3-color-rune-b { color: #6e7ee5 !important; }
	.d3-color-rune-c { color: #948b91 !important; }
	.d3-color-rune-d { color: #fa8b14 !important; }
	.d3-color-rune-e { color: #f7e9b7 !important; }

.d3-debug { display: none; }
.tooltip-icon-bullet { display: inline-block; width: 8px; height: 8px; margin-right: 2px; vertical-align: middle; background: url("../images/icons/bullet.gif") no-repeat; }